@use 'sass:math';
@import './var.scss';
@import './theme-var.scss';

$namespace: 'vl';

/* -----------BEM--------------- */
@mixin bem($block) {
  $Comp: $namespace + '-' + $block !global;

  .#{$Comp} {
    // @content; // 类似插槽 使用时可自定义内容替换
    @content;
  }
}

/* -----------shape--------------- */
@mixin shape($text-width: $--size-medium) {
  &.vl-button-shape-rect {
    border-radius: $radius;
  }
  &.vl-button-shape-capsule {
    border-radius: math.div($text-width, 2);
  }
  &.vl-button-shape-circle {
    min-width: $text-width;
    border-radius: 50%;
  }
}
